<div class="row">
    <div class="col-lg-12">
        <section class="panel">
            <header class="panel-heading">
                合同列表
            </header>
            <div class="panel-body">
                <div class="row">
                    <div class="col-lg-6 col-md-12">
                        <form class="form-inline" role="form" onsubmit="return false;">
                            <div class="form-group">
                                <select id="ContractType" class="form-control">
                                    <option value='0' selected>全部</option>
                                    <option value='1'>我提交的合同</option>
                                    <option value='2'>我簽訂的合同</option>
                                    <option value='3'>我審核的合同</option>
                                </select>
                            </div>

                            <div class="form-group">
                                <input type="text" class="form-control" id="Keyword" placeholder="客户名称/合同编号/合同名称">
                            </div>
                            <button id="SearchBtn" type="button" class="btn btn-success">搜索</button>
                        </form>
                    </div>
                    <div class="col-lg-6 col-md-12" style="text-align: right">
                        <button id="Add" class="btn btn-danger"><i class=" icon-plus"></i> 新建合同</button>
                        <button id="Export" class="btn"><i class="icon-cloud-download"></i> 导出</button>
                    </div>
                </div>
                <div class="row">

                    <div class="col-lg-12">
                        <table id="DataList" lay-filter="DataList" class="table"></table>

                        <script type="text/html" id="HeadToolBar_0">
                            <div class="layui-btn-container">

                            </div>
                        </script>
                        <script type="text/html" id="HeadToolBar_3">
                            <div class="layui-btn-container">
                                <button class="layui-btn layui-btn-sm layui-btn-primary " lay-event="pass">
                                    <i class="icon-ok"></i> 审核通过
                                </button>
                                <button class="layui-btn layui-btn-sm layui-btn-primary " lay-event="nopass">
                                    <i class="icon-remove"></i> 审核不通过
                                </button>
                            </div>
                        </script>

                        <script type="text/html" id="ToolBar_0">
                            <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="check">查看</i> </a>
                            <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="del">删除</i> </a>
                        </script>
                        <script type="text/html" id="ToolBar_3">
                            <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="pass">审核通过</i> </a>
                            <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="nopass">审核不通过</i> </a>
                            <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="check">查看</i> </a>
                            <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="del">删除</i> </a>
                        </script>
                    </div>
                </div>


            </div>
        </section>

    </div>
</div>
<!-- 新增合同 -->
<div id="AddDialog" style="display: none">
    <form class="layui-form form-horizontal" role="form">

        <div class="row" style="margin: 15px 15px;">
            <div class="form-group">
                <label class="col-md-3 control-label">合同编号</label>
                <div class="col-md-9">
                    <input id="Number" type="text" class="form-control" placeholder="不填则自动生成">
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">合同名称<span class="xsg-span-required">*</span> </label>
                <div class="col-md-9">
                    <input id="Name" type="text" class="form-control" placeholder="">
                </div>
            </div>
            <div class="form-group" >
                <label class="col-md-3 control-label">客户名称<span class="xsg-span-required">*</span></label>
                <div class="col-md-9">
                    <select id="ClientID" name="ClientID" lay-verify="required" lay-search="" class="form-control">
                        <?php
                            foreach($Clients as $Key => $Val){
                                $tID = $Val['ID'];
                                $tName = $Val['Name'];
                                echo "<option value='$tID'>$tName</option>";
                            }
                        ?>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">合同金额<span class="xsg-span-required">*</span></label>
                <div class="col-md-9">
                    <input id="Money" type="number" class="form-control" lay-verify="required" placeholder="">
                </div>
            </div>

            <div class="form-group">
                <label class="col-md-3 control-label">合同开始时间<span class="xsg-span-required">*</span></label>
                <div class="col-md-9">
                    <input id="Begin" type="text" class="form-control" lay-verify="required" placeholder="">
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">合同结束时间<span class="xsg-span-required">*</span></label>
                <div class="col-md-9">
                    <input id="End" type="text" class="form-control" lay-verify="required" placeholder="">
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">公司签约人</label>
                <div class="col-md-9">
                    <select id="SignerID" name="SignerID" lay-verify="required" lay-search="" class="form-control">
                        <?php
                        foreach($Users as $Key => $Val){
                            $tID = $Val['ID'];
                            $tName = $Val['Nick'];
                            $tDepartment = $Val['DepartmentName'];
                            $tSelected = '';
                            if($tID == $UserID)$tSelected = 'selected';
                            echo "<option value='$tID' $tSelected>$tDepartment - $tName</option>";
                        }
                        ?>
                    </select>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">审核人</label>
                <div class="col-md-9">
                    <select id="AuditorID" name="AuditorID" lay-verify="required" lay-search="" class="form-control">
                        <?php
                        foreach($Users as $Key => $Val){
                            $tID = $Val['ID'];
                            $tName = $Val['Nick'];
                            $tDepartment = $Val['DepartmentName'];
                            echo "<option value='$tID'>$tDepartment - $tName</option>";
                        }
                        ?>
                    </select>
                </div>
            </div>

            <div class="form-group">
                <label class="col-md-3 control-label">合同电子版</label>
                <div class="col-md-9">
                    <div class="layui-upload">
                        <button type="button" class="btn btn-primary" id="UploadBtn">选择文件</button>
                        <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
                            预览图：
                            <div class="layui-upload-list" id="PreviewImages"></div>
                        </blockquote>
                    </div>
                </div>
            </div>

            <div class="form-group">
                <label class="col-md-3 control-label">备注</label>
                <div class="col-md-9">
                    <textarea id="Remark" class="form-control"></textarea>
                </div>
            </div>
        </div>
    </form>

</div>
<!-- 查看合同 -->
<div id="CheckDialog" style="display: none">
    <form class="layui-form form-horizontal" role="form">

        <div class="row" style="margin: 15px 15px;">
            <div class="form-group">
                <label class="col-md-3 control-label">合同编号</label>
                <div class="col-md-9">
                    <p id="Lab_Number" class="form-control-static"></p>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">合同名称<span class="xsg-span-required">*</span> </label>
                <div class="col-md-9">
                    <p id="Lab_Name" class="form-control-static"></p>
                </div>
            </div>
            <div class="form-group" >
                <label class="col-md-3 control-label">客户名称<span class="xsg-span-required">*</span></label>
                <div class="col-md-9">
                    <p id="Lab_ClientID" class="form-control-static"></p>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">合同金额<span class="xsg-span-required">*</span></label>
                <div class="col-md-9">
                    <p id="Lab_Money" class="form-control-static"></p>
                </div>
            </div>

            <div class="form-group">
                <label class="col-md-3 control-label">合同开始时间<span class="xsg-span-required">*</span></label>
                <div class="col-md-9">
                    <p id="Lab_Begin" class="form-control-static"></p>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">合同结束时间<span class="xsg-span-required">*</span></label>
                <div class="col-md-9">
                    <p id="Lab_End" class="form-control-static"></p>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">公司签约人</label>
                <div class="col-md-9">
                    <p id="Lab_SignerID" class="form-control-static"></p>
                </div>
            </div>
            <div class="form-group">
                <label class="col-md-3 control-label">审核人</label>
                <div class="col-md-9">
                    <p id="Lab_AuditorID" class="form-control-static"></p>
                </div>
            </div>

            <div class="form-group">
                <label class="col-md-3 control-label">合同电子版</label>
                <div class="col-md-9">
                    <div class="layui-upload">
                        <blockquote class="layui-elem-quote layui-quote-nm" style="margin-top: 10px;">
                            <div class="layui-upload-list" id="Edit_PreviewImages"></div>
                        </blockquote>
                    </div>
                </div>
            </div>

            <div class="form-group">
                <label class="col-md-3 control-label">备注</label>
                <div class="col-md-9">
                    <textarea id="Lab_Remark" class="form-control" disabled></textarea>
                </div>
            </div>
        </div>
    </form>

</div>
<script>
    layui.use(['table', 'layer', 'jquery','upload','laydate'], function () {
        var table = layui.table,
            layer = layui.layer,
            upload = layui.upload,
            laydate = layui.laydate,
            $ = layui.$,
            FileUrls = [];

        //选择对应合同分类
        $('#ContractType').bind('change',function () {
            var ContractType = $('#ContractType').val();
            var Keyword = $('#Keyword').val();

            var ToolBar = '#ToolBar_0';
            var ToolBarWidth = 128;
            if(ContractType == 3) {
                ToolBar = '#ToolBar_3';
                ToolBarWidth = 300;
            }
            var HeadToolBar = '#HeadToolBar_0';
            if(ContractType == 3) HeadToolBar = '#HeadToolBar_3';

            table.reload('DataList', {
                where: {
                    Type: ContractType,
                    Keyword: Keyword
                }
                , toolbar: HeadToolBar //开启头部工具栏，并为其绑定左侧模板
                , cols: [[ //表头 總寬度1670
                    {type: 'checkbox', fixed: 'left'}
                    , {field: 'Number', title: '合同编号', width: 160, fixed: 'left'}
                    , {field: 'Name', title: '合同名称', width: 250, fixed: 'left'}
                    , {field: 'ClientName', title: '客户名称', width: 200}
                    , {field: 'Money', title: '金额', sort:true}
                    , {field: 'Begin', title: '开始时间', sort:true}
                    , {field: 'End', title: '结束时间', sort:true}
                    , {field: 'SignerName', title: '签订人'}
                    , {field: 'AuditorName', title: '审核人'}
                    , {field: 'StatusName', title: '状态'}
                    , {title: '編輯', width: ToolBarWidth, align: 'center', toolbar: ToolBar, fixed: 'right'}
                ]]
            });
        });

        //合同列表
        var tableIns = table.render({
            elem: '#DataList'
            , autoSort: false
            , height: 'full-250'
            , url: '/index.php/user/Contract/mb_Listing' //数据接口
            // , page: true //开启分页
            , toolbar: '#HeadToolBar_0' //开启头部工具栏，并为其绑定左侧模板
            , page: {
                theme: '#ff6c60'
            }
            , where:{
                Type:$('#ContractType').val(),
                Keyword:$('#Keyword').val()
            }
            , limit: 100
            , limits: [100, 200, 300, 400, 500]
            , cols: [[ //表头 總寬度1670
                {type: 'checkbox', fixed: 'left'}
                , {field: 'Number', title: '合同编号', width: 160, fixed: 'left'}
                , {field: 'Name', title: '合同名称', width: 250, fixed: 'left'}
                , {field: 'ClientName', title: '客户名称', width: 200}
                , {field: 'Money', title: '金额', sort:true}
                , {field: 'Begin', title: '开始时间', sort: true}
                , {field: 'End', title: '结束时间', sort:true}
                , {field: 'SignerName', title: '签订人'}
                , {field: 'AuditorName', title: '审核人'}
                , {field: 'StatusName', title: '状态'}
                , {title: '編輯', width: 128, align: 'center', toolbar: '#ToolBar_0', fixed: 'right'}
            ]]
        });

        //触发排序事件
        table.on('sort(DataList)', function(obj){ //注：sort 是工具条事件名，test 是 table 原始容器的属性 lay-filter="对应的值"
            console.log(obj.field); //当前排序的字段名
            console.log(obj.type); //当前排序类型：desc（降序）、asc（升序）、null（空对象，默认排序）

            var ToolBar = '#ToolBar_0';
            var ToolBarWidth = 128;
            if(ContractType == 3) {
                ToolBar = '#ToolBar_3';
                ToolBarWidth = 300;
            }
            var HeadToolBar = '#HeadToolBar_0';
            if(ContractType == 3) HeadToolBar = '#HeadToolBar_3';

            var ContractType = $('#ContractType').val();
            var Keyword = $('#Keyword').val();

            //尽管我们的 table 自带排序功能，但并没有请求服务端。
            //有些时候，你可能需要根据当前排序的字段，重新向服务端发送请求，从而实现服务端排序，如：
            table.reload('DataList', {
                initSort: obj //记录初始排序，如果不设的话，将无法标记表头的排序状态。
                ,where: { //请求参数（注意：这里面的参数可任意定义，并非下面固定的格式）
                    Type: ContractType,
                    Keyword: Keyword,
                    OrderField: obj.field, //排序字段
                    OrderType: obj.type //排序方式
                }
                , cols: [[ //表头 總寬度1670
                    {type: 'checkbox', fixed: 'left'}
                    , {field: 'Number', title: '合同编号', width: 160   , fixed: 'left'}
                    , {field: 'Name', title: '合同名称', width: 250, fixed: 'left'}
                    , {field: 'ClientName', title: '客户名称', width: 200}
                    , {field: 'Money', title: '金额', sort:true}
                    , {field: 'Begin', title: '开始时间', sort:true}
                    , {field: 'End', title: '结束时间', sort:true}
                    , {field: 'SignerName', title: '签订人'}
                    , {field: 'AuditorName', title: '审核人'}
                    , {field: 'StatusName', title: '状态'}
                    , {title: '編輯', width: ToolBarWidth, align: 'center', toolbar: ToolBar, fixed: 'right'}
                ]]
            });
        });

        //监听行工具事件
        table.on('tool(DataList)', function (obj) {
            var data = obj.data; //获得当前行数据
            var layEvent = obj.event; //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
            var tr = obj.tr; //获得当前行 tr 的 DOM 对象（如果有的话）

            if(layEvent === 'pass' || layEvent === 'nopass'){
                //通过审核
                if(data.Status == 1){
                    layer.msg('该合同记录为草稿，请先提交', {icon: 2});
                    return false;
                } else if(data.Status == 3 || data.Status == 4){
                    layer.msg('该合同记录已审核', {icon: 2});
                    return false;
                }

                var Status = 3;
                if(layEvent === 'nopass')Status = 4;
                if(data.AuditorID == {$UserID}){
                    var fields = {
                        Type:'Contract',
                        Params:JSON.stringify({
                            ID:data.ID,
                            Status:Status
                        })
                    }
                    global.post('/index.php/user/Event/mb_Edit', fields, function (msg) {
                        if (msg['code'] == ErrCode_Normal) {
                            layer.msg(msg['msg'], {
                                offset: '15px'
                                , icon: 1
                                , time: 1000
                            }, function () {
                                tableIns.reload();
                            });
                        } else mb_OnMessage(msg);
                    });
                } else {
                    layer.msg('您不是审核人，无法审核该记录', {icon: 2});
                    return false;
                }

            } else if (layEvent === 'del') {
                //删除
                if (data.Status == 3) {
                    layer.msg('该合同记录已审核', {icon: 2});
                    return false;
                }
                var fields = {
                    Type: 'Contract',
                    IDs: data.ID
                };
                global.post('/index.php/user/Event/mb_Delete', fields, function (msg) {
                    if (msg['code'] == ErrCode_Normal) {
                        layer.msg(msg['msg'], {
                            offset: '15px'
                            , icon: 1
                            , time: 1000
                        }, function () {
                            tableIns.reload();
                        });
                    } else mb_OnMessage(msg);
                });
            } else if(layEvent === 'check'){
                //查看
                $('#Lab_Number').text(data.Number);
                $('#Lab_Name').text(data.Name);
                $('#Lab_Money').text(data.Money);
                $('#Lab_Begin').text(data.Begin);
                $('#Lab_End').text(data.End);
                $('#Lab_Remark').text(data.Remark);

                $('#Lab_ClientID').text(data.ClientName);
                $('#Lab_SignerID').text(data.SignerName);
                $('#Lab_AuditorID').text(data.AuditorName);

                $('#Edit_PreviewImages').html();
                var FileUrls = JSON.parse(data.FileUrls);
                for(var i=0; i<FileUrls.length; i++){
                    $('#Edit_PreviewImages').append('<a href="'+FileUrls[i]+'" target="_blank"><img src="'+ FileUrls[i] +'" alt="合同电子版" class="layui-upload-img" style="max-width: 128px;margin: 10px"></a>');
                }
                var dialogWidth = '650px';
                if (document.documentElement.scrollWidth < 500) {
                    //手機版
                    dialogWidth = '350px';
                }
                layer.open({
                    type: 1,
                    title: '查看合同',
                    area: [dialogWidth, '700px'],
                    content: $('#CheckDialog'), //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
                });
            }
        });

        //头工具栏事件
        table.on('toolbar(DataList)', function (obj) {
            var checkStatus = table.checkStatus(obj.config.id);

            if(checkStatus.data.length == 0){
                layer.msg('请选择合同', {icon: 2});
                return false
            }

            switch (obj.event) {
                case 'pass':
                    var data = checkStatus.data;
                    for (var i = 0; i < data.length(); i++) {
                        if(data[i].Status == 1){
                            layer.msg('有合同记录为草稿，请先提交', {icon: 2});
                            return false;
                        } else if(data[i].Status == 3 || data.Status == 4){
                            layer.msg('有合同记录已审核', {icon: 2});
                            return false;
                        }
                        if(data.AuditorID != {$UserID}){
                            layer.msg('有合同记录不是由您审核，请重新选择', {icon: 2});
                            return false;
                        }
                    }
                    for(var i=0; i<data.length();i++){

                        var fields = {
                            Type:'Contract',
                            Params:{
                                ID:data[i].ID,
                                Status:3
                            }
                        }
                        global.post('/index.php/user/Event/mb_Edit', fields, function (msg) {
                            if (msg['code'] == ErrCode_Normal) {

                            } else mb_OnMessage(msg);
                        });
                    }

                    layer.msg('保存成功', {
                        offset: '15px'
                        , icon: 1
                        , time: 1000
                    }, function () {
                        tableIns.reload();
                    });

                    break;
                case 'nopass':
                    var data = checkStatus.data;
                    for (var i = 0; i < data.length(); i++) {
                        if(data[i].Status == 1){
                            layer.msg('有合同记录为草稿，请先提交', {icon: 2});
                            return false;
                        } else if(data[i].Status == 3 || data.Status == 4){
                            layer.msg('有合同记录已审核，请重新选择', {icon: 2});
                            return false;
                        }
                        if(data.AuditorID != {$UserID}){
                            layer.msg('有合同记录不是由您审核，请重新选择', {icon: 2});
                            return false;
                        }
                    }
                    for(var i=0; i<data.length();i++){

                        var fields = {
                            Type:'Contract',
                            Params:{
                                ID:data[i].ID,
                                Status:4
                            }
                        }
                        global.post('/index.php/user/Event/mb_Edit', fields, function (msg) {
                            if (msg['code'] == ErrCode_Normal) {

                            } else mb_OnMessage(msg);
                        });
                    }
                    layer.msg('保存成功', {
                        offset: '15px'
                        , icon: 1
                        , time: 1000
                    }, function () {
                        tableIns.reload();
                    });
                    break;
                case 'delete':
                    //刪除選中
                    var data = checkStatus.data;
                    var ids = '';
                    for (var i = 0; i < data.length; i++) {
                        if (data[i].Status == 3) {
                            layer.msg('有合同记录已审核，请重新选择', {icon: 2});
                            return false;
                        }
                    }
                    for (var i = 0; i < data.length; i++) {
                        ids += data[i].ID;
                        if (i != data.length - 1) ids += ','
                    }
                    var fields = {
                        Type: 'Contract',
                        IDs: ids
                    };
                    global.post('/index.php/user/Event/mb_Delete', fields, function (msg) {
                        if (msg['code'] == ErrCode_Normal) {
                            layer.msg(msg['msg'], {
                                offset: '15px'
                                , icon: 1
                                , time: 1000
                            }, function () {
                                // window.location.reload();
                                tableIns.reload();
                            });
                        } else mb_OnMessage(msg);
                    });
                    break;
                default:
                    break;
            }
        });

        //搜寻按钮按下
        $('#SearchBtn').bind('click', function () {
            table.reload('DataList', {
                where: {
                    Keyword: $('#Keyword').val(),
                    Type:$('#ContractType').val()
                }
            });
        });

        //关键字输入框回车按下
        $('#Keyword').bind('keypress', function (event) {
            if (event.keyCode == "13") {
                //需要处理的事情
                table.reload('DataList', {
                    where: {
                        Keyword: $('#Keyword').val(),
                        Type:$('#ContractType').val()
                    }
                });
            }
        });

        //新增合同按钮按下
        $('#Add').bind('click',function () {

            $('#Number').val('');
            $('#Name').val('');
            $('#Money').val('');
            $('#Begin').val('');
            $('#End').val('');
            $('#Remark').val('');
            $('#PreviewImages').html('');

            var dialogWidth = '650px';
            if (document.documentElement.scrollWidth < 500) {
                //手機版
                dialogWidth = '350px';
            }
            layer.open({
                type: 1,
                title: '新增合同',
                area: [dialogWidth, '700px'],
                content: $('#AddDialog'), //这里content是一个DOM，注意：最好该元素要存放在body最外层，否则可能被其它的相对元素所影响
                btn: ['保存', '取消'],
                yes: function (index, layero) {
                    var Number = $('#Number').val();
                    var Name = $('#Name').val();
                    var ClientID = $('#ClientID').val();
                    var Money = $('#Money').val();
                    var Begin = $('#Begin').val();
                    var End = $('#End').val();
                    var SignerID = $('#SignerID').val();
                    var AuditorID = $('#AuditorID').val();
                    var Remark = $('#Remark').val();

                    if (Name == '') {
                        layer.msg('请输入合同名称', {icon: 2});
                        return;
                    }
                    if (ClientID == 0) {
                        layer.msg('请选择客户', {icon: 2});
                        return;
                    }
                    if (SignerID == 0) {
                        layer.msg('请选择公司签约人', {icon: 2});
                        return;
                    }
                    if (AuditorID == 0) {
                        layer.msg('请选择审核人', {icon: 2});
                        return;
                    }

                    var fields = {
                        ContractID:0,
                        Number:Number,
                        Name:Name,
                        ClientID:ClientID,
                        Money:Money,
                        SignerID:SignerID,
                        AuditorID:AuditorID,
                        FileUrls: JSON.stringify(FileUrls),
                        Begin:Begin,
                        End:End,
                        Remark:Remark,
                        Status:2
                    }

                    global.post('/index.php/user/Contract/mb_Submit', fields, function (msg) {
                        if (msg['code'] == ErrCode_Normal) {
                            layer.msg('保存成功', {
                                offset: '15px'
                                , icon: 1
                                , time: 1000
                            }, function () {
                                layer.close(index);
                                tableIns.reload();
                            });
                            return false;
                        } else {
                            mb_OnMessage(msg);
                            return false;
                        }
                    });
                },
                btn2: function (index, layer0) {
                    console.log('取消按下');
                }
            });
        });

        //多图片上传
        upload.render({
            elem: '#UploadBtn'
            ,url: '/index.php/Index/Common/UploadImage' //此处配置你自己的上传接口即可
            ,multiple: true
            ,field: 'Image'
            ,before: function(obj){
                //预读本地文件示例，不支持ie8
                // obj.preview(function(index, file, result){
                //     $('#PreviewImages').append('<a href="'+result+'" target="_blank"><img src="'+ result +'" alt="'+ file.name +'" class="layui-upload-img" style="max-width: 128px;max-height: 128px;"></a>')
                // });
            }
            ,done: function(res){
                //上传完毕
                if (res['code'] == ErrCode_Normal) {
                    var src = res['data']['src'];
                    FileUrls.push(src);
                    $('#PreviewImages').append('<a href="'+src+'" target="_blank"><img src="'+ src +'" alt="合同电子版" class="layui-upload-img" style="max-width: 128px;margin: 10px"></a>');
                } else mb_OnMessage(res);
            }
        });

        laydate.render({
            elem: '#Begin',
            type: 'date',
            theme: '#ff6c60'
        });
        laydate.render({
            elem: '#End',
            type: 'date',
            theme: '#ff6c60'
        });
    });

</script>
<style>
    .layui-input{
        border-color: #e2e2e4;
        height: 34px;
        border-radius: 4px;
        color:#c2c2c2;
    }
    .xsg-span-required{
        color: red;
        margin: 0 5px;
    }
    .layui-table-tips-c:before{
        position: relative;
        right: 1px;
        top: -3px;
    }
</style>